<!-- 背景设置测试组件 -->
<template>
  <div class="background-settings-test">
    <h2>背景设置测试</h2>
    <el-button type="primary" @click="showSettings = true">打开背景设置</el-button>
    
    <BackgroundSettings 
      v-model="showSettings"
      @settings-updated="handleSettingsUpdated"
    />
  </div>
</template>

<script setup>
import { ref } from 'vue'
import { ElMessage } from 'element-plus'
import BackgroundSettings from './BackgroundSettings.vue'

const showSettings = ref(false)

const handleSettingsUpdated = () => {
  ElMessage.success('背景设置已更新')
}
</script>

<style scoped>
.background-settings-test {
  padding: 20px;
  text-align: center;
}

h2 {
  margin-bottom: 20px;
  color: white;
}
</style> 